<div class="row-fluid">
<h2 class="pull-left" id="azuria">Interface do Mapa</h2><br><br>
</div>

<!-- begin content --><div class="node format ">
			
	<p><!-- TWO-COLUMNS --></p>
<style type="text/css">dt, .block-story h3, .block-story h4, .block-story h5, .block-story h6{border-color:transparent;margin:0;}
#node-design{width:712px;height:inherit;overflow:hidden;}

#node-design img{border:none !important;margin-top:22px;}
#node-design > p img, /* <<--- dumb node bug */ #node-design > img{width:calc(100% - 6px);box-shadow:0 0 0 1px #fff, 0 0 0 3px #35214d;}

.lb{height:1px;margin:10px 0;width:100%;}
.lb1{background-color:#d1dcd1;}
.lb2{background-color:#9ac1b1;}
p ~ .lb{margin:22px 0 10px;}

section{width:552px;height:inherit;overflow:hidden;background-color:#5b8474;padding:20px 25px;margin:45px 0;position:relative;z-index:0;box-shadow:inset 0 0 0 1px #ffffc1, 0 0 0 2px #305e65;left:2px;}
section img{width:calc(100% - 0px);box-shadow:0 0 0 0px #fff;}
section:last-of-type{margin:0px 0 3px;}
#node-design section h1, #node-design section h2, #node-design section h3, #node-design section h4, #node-design section h5, #node-design section h6{color:#ffee7f;text-shadow:0 1px 0 #0b252c;}
#node-design section p{color:#fff;text-shadow:0 1px 0 #264e3e;text-align:justify;}
section:before, section:after{content:'';display:block;width:706px;height:47px;position:absolute;left:1px;background:url('http://s.aeriastatic.com/files/aurakingdom/image/a/arkus-node-ornament.png') 0 0 no-repeat;z-index:-1;}
section:before{top:0;}
section:after{bottom:0;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg);}

#node-design p{line-height:21px;margin:0 0 12px;}
#node-design a{font-weight:900;color:#5e309f;text-decoration:underline;}
#node-design b{color:#545454;font-weight:900;}

section a{color:#ffee7f !important;text-shadow:0 1px 0 rgba(0,0,0,0.5);}
section b{color:#fff !important;text-shadow:0 1px 0 rgba(0,0,0,0.5);}

ul.a {list-style-type:circle;}
ul.b {list-style-type:square;}
</style>
<article id="node-design">
<section>
<h3>Interface do Mapa e Legenda</h3>

<p>Aura Kingdom tem um belo mundo para ser explorado e satisfazer até mesmo os mais intrépidos exploradores! Para ajudá-lo a conhecer todo o mundo, certifique-se de verificar o mapa!</p>

<h4>Minimapa</h4>

<p>O Minimap está localizado no canto superior direito da tela. Ele exibe a área e coordenadas, comerciantes, npcs com missões e a atual localização do personagem. Ele também tem vários botões de atalho para acessar recursos como caixa de correio ou o de sistema procurar partys.</p>

<p><img src="http://s.aeriastatic.com/files/aurakingdom/image/Q/Quest_3.png"></p>

<h4>Botões de atalho do Minimapa</h4>

<p><img src="http://s.aeriastatic.com/files/aurakingdom/image/Q/Quest_4.png"></p>

<h4>Legenda do Mapa</h4>

<p>Vários ícones encontrados no mini-mapa também podem ser encontrados no mapa regional e são usados ​​para identificar áreas de interesse, como mercadores, alquimistas, portais e muito mais. Todos os ícones podem ser filtrados a partir do mapa regional, permitindo-lhe decidir quais recursos você gostaria que o mapa mostrasse.</p>

<p><img src="http://s.aeriastatic.com/files/aurakingdom/image/Q/Quest_5.png"></p>

<h3>Zona de Pesquisa: NPC/Monsters</h3>

<p>Não está conseguindo localizar um npc ou monstro? Em seu mapa regional tem um menu drop-down que lhe permite encontrar NPCs e monstros comuns. Assim, você pode clicar e ir direto para onde eles se encontram, se você quiser!</p>

<p><img src="http://s.aeriastatic.com/files/aurakingdom/image/Q/Quest_6.png"></p>

<div class="lb lb2"><!-- LINE BREAK FOR INSIDE OF SECTION TAGS --></div>
</section>
</article>
<script type="text/javascript">
var getNode = document.querySelector('.node.format');
var getPs = getNode.querySelectorAll('p');
var getBRs = getNode.querySelectorAll('br');

function eraseThemNow(){
	for(i=0; i<getPs.length; i++){
		if(getPs[i].innerHTML.length == 0 || i == 0){
			getPs[i].style.display = "none";
		}
		else{
			console.log('tags erased');
		}
	}
	for(j=0; j<getBRs.length; j++){
		getBRs[j].innerHTML.length === 0 ? getBRs[j].style.display = "none" : console.log('tags erased');
	}
}
eraseThemNow();
</script>	
		
</div>
<!-- end content -->

